$black: #000;
$light-black: #333333;
$white: #fff;
$dark-blue: #424f62;
$blue: #4977FC;
$gray: #ccc;
$dark-gray: #666;
$light-gray: #DCDFE6;
$class-gray: #F5F5F5;
$green: #67C23A;
$red: #ff2825;
$light-red: #C50508;

$font12: 12px;
$font14: 14px;
$font16: 16px;
$font18: 18px;
$font20: 20px;
$font22: 22px;
$font24: 24px;
$font26: 26px;

@mixin line-height($height) {
  height: $height;
  line-height: $height;
}

@mixin div-nowrap {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/deep/ .el-table--scrollable-x .el-table__body-wrapper {
  overflow-y: hidden;
}

/deep/ .el-table__body-wrapper:hover {
  overflow: auto;
}

.el-table--enable-row-hover .el-table__body tr:hover > td {
  background-color: #F3F5FA;
}

.el-table__body tr.hover-row > td {
  background-color: #F3F5FA;
}

// element table 动态样式
.red {
  color: $red;
}

.cell-position {
  position: relative;
}

.fade-page-enter-active,
.fade-page-leave-active {
  transition: all .3s;
}

.fade-page-enter {
  opacity: 0;
  transform: translateX(-20px);
}

.fade-page-leave-to {
  opacity: 0;
  transform: translateX(-20px);
}

/* breadcrumb transition */
.breadcrumb-enter-active,
.breadcrumb-leave-active {
  transition: all .5s;
}

.breadcrumb-enter,
.breadcrumb-leave-active {
  opacity: 0;
  transform: translateX(20px);
}

.breadcrumb-move {
  transition: all .5s;
}

.breadcrumb-leave-active {
  position: absolute;
}
